<!--
 * @Author: your name
 * @Date: 2021-10-08 19:22:31
 * @LastEditTime: 2021-10-08 21:27:30
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \vue3.0\vue3_vite\src\pages\connection\test2\father.vue
-->
<template>
  <div>
    <h1>provide / inject</h1>
    <h2>father</h2>
    <p>{{ count }}</p>
    <a-button type="primary" @click="addCount">add</a-button>
    
    <Child />
  </div>
</template>

<script>
import { provide, ref } from 'vue'
import Child from './child.vue'

export default {
  
  setup(props, ctx) {
    
    const count = ref(0)
    const addCount = () => {
      console.log(props, ctx)
      count.value ++
    }

    provide('faCount', count)
    provide('number', 0)

    return {
      count,
      addCount,
    }
  },
  components: {
    Child
  }
}
</script>

<style>

</style>